<!--
  描述：后端产品分类-故障图片详情页
  @author yangshuangping
  @since 2021/11/18 18:37
-->
<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">

<head th:include="common/common :: jscss">
    <title>新增或编辑分类</title>
</head>
<body>

<div class="layui-fluid">
    <div class="layui-card">
        <form method="post" action="" class="layui-form" lay-filter="zmn-form">

            <input type="hidden" name="faultId" th:value="${categoryFaultImage.faultId}"/>
            <input type="hidden" name="groupId" th:value="${categoryFaultImage.groupId}"/>
            <div class="layui-split">&nbsp;</div>

            <div class="layui-form-item" th:if="${categoryFaultImage.faultId > 0}">
                <label class="layui-form-label">ID：</label>
                <div class="layui-input-block">
                    <div class="layui-form-mid">
                        <span th:text="${categoryFaultImage.faultId}">ID</span>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label layui-form-required">部位类型：</label>
                <div class="layui-input-block">
                    <div class="layui-input-inline" style="width: 310px">
                        <select name="partType" lay-search lay-verify="required">
                            <option value=""></option>
                            <option th:each="type:${listFaultType}" th:value="${type.key}"
                                    th:selected="${type.key == categoryFaultImage.partType}"
                                    th:text="${type.value}"/>
                        </select>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label layui-form-required">部位名称：</label>
                <div class="layui-input-block">
                    <div class="layui-input-inline" style="width: 310px">
                        <input type="text" name="partName" th:value="${categoryFaultImage.partName}"
                               placeholder="请填写部位名称，不能超过100个字符"
                               lay-verify="required" autocomplete="off" class="layui-input" maxlength="100"/>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label layui-form-required">序号坐标：</label>
                <div class="layui-input-block">
                    <div class="layui-input-inline" style="width: 310px">
                        <input type="text" name="coord" th:value="${categoryFaultImage.coord}"
                               placeholder="请填写图片x轴、y轴坐标以“,”隔开，如：30,25"
                               lay-verify="coord" autocomplete="off" class="layui-input" maxlength="100"/>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label layui-form-required">默认图片：</label>
                <div class="layui-upload-drag" id="defaultImgSrc">
                    <input type="hidden" id="defaultImgSrcValue" lay-verify="defaultImg" name="defaultImg">
                    <i class="layui-icon"></i>
                    <p>点击上传</p>
                </div>
                <div class="layui-inline" style="width: 200px;">
                    <i onclick="previewImg('defaultImgSrcValue')" class="layui-icon layui-icon-search btn-review"></i>
                    <br>
                    <br>
                    <i onclick="deleteImg('defaultImgSrc')" class="layui-icon layui-icon-delete btn-del funcClass"></i>
                </div>
                <div class="layui-input-inline" style="margin-left: 152px;width: 310px;">
                    <span style="color: #9F9F9F;">请上传整机照片</span>
                </div>
                <div class="layui-input-inline" style="margin-left: 152px;width: 260px;">
                    <span style="color: red;">(格式支持：jpg或jpeg，上传照片需< 4M)</span>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">故障图片：</label>
                <div class="layui-upload-drag" id="faultImgSrc">
                    <input type="hidden" id="faultImgSrcValue" name="faultImg">
                    <i class="layui-icon"></i>
                    <p>点击上传</p>
                </div>
                <div class="layui-inline" style="width: 200px;">
                    <i onclick="previewImg('faultImgSrcValue')" class="layui-icon layui-icon-search btn-review"></i>
                    <br>
                    <br>
                    <i onclick="deleteImg('faultImgSrc')" class="layui-icon layui-icon-delete btn-del funcClass"></i>
                </div>
                <div class="layui-input-inline" style="margin-left: 152px;width: 310px;">
                    <span style="color: #9F9F9F;">请上传故障部位图片</span>
                </div>
                <div class="layui-input-inline" style="margin-left: 152px;width: 260px;">
                    <span style="color: red;">(格式支持：jpg或jpeg，上传照片需< 4M)</span>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"></label>
                <div class="layui-input-block">
                    <div class="layui-input-inline" style="width: 310px">
                        <div id="faultRelevance"></div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">故障坐标：</label>
                <div class="layui-input-block">
                    <div class="layui-input-inline" style="width: 310px">
                        <input type="text" name="faultCoord" th:value="${categoryFaultImage.faultCoord}"
                               placeholder="请填写图片x轴、y轴坐标以“,”隔开，如：30,25"
                               autocomplete="off" class="layui-input" maxlength="100"/>
                    </div>
                </div>
            </div>
            <div class="layui-split">&nbsp;</div>
            <div class="layui-form-item layui-layout-admin">
                <div class="layui-input-block">
                    <div class="layui-footer" style="left: 0;">
                        <button class="layui-btn" lay-submit="" lay-filter="zmn-form-submit">保存</button>
                        <button class="layui-btn layui-btn-primary"
                                onclick="zmnLayUtil.closeThisIframe(parent,{reloadPage: true})">取消
                        </button>
                    </div>
                </div>
            </div>

        </form>

    </div>

</div>

<script type="text/javascript" th:inline="javascript">

    var json = {
        categoryFaultImage: [[${categoryFaultImage}]],
        listFault: [[${listFault}]],
        listPitchOnFault: [[${listPitchOnFault}]]
    };

    layui.config({
        base: "/static/lay/",
        version: 20220105
    }).extend({
        index: "lib/index",
        category_faultimage_detail: "servcategory/faultimage/zmn.category.faultimage.edit",
    }).use(['index', 'category_faultimage_detail']);

</script>

</body>
<style>
    xm-select {
        min-height: 33px;
        line-height: 33px;
    }
</style>
</html>